<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="sitemesh" uri="http://www.opensymphony.com/sitemesh/decorator" %>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<style>
    .lxm-li-clearboth {
        /*clear:both;*/
    }

    .lxm-wbslh {
        /*float: right;
        width: 100px;
        display: block;
        border: 1px solid red;
        */
    }
</style>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<script type="text/javascript">
$(document).ready(function() {

	var loadMenu = function(menucode){
			$.ajax({
				type : 'GET',
				dataType : 'json',
				url : ctx + "/sys/role/loadMenuData.do?parentMenuCode="+menucode,
				contentType : 'charset=utf-8',
				success : function(msg) {
					var menustr = '';
					var data = msg.aaData;
					$(data).each(function(i, n) {
						if(i==0){
							menustr += '<li><a href="#';
							menustr += menucode;
							menustr += '" title="'
							menustr += n.MENU_NAME;
							menustr += '" data-toggle="collapse" aria-expanded="true" class="">';
						}
						if(menucode == '1000' && i == 0){
							menustr+='<em class="fa fa-line-chart"></em>';
						}else if(menucode == '2000' && i == 0){
							menustr+='<em class="icon-layers"></em>';
						}else if(menucode == '3000' && i == 0){
							menustr+='<em class="icon-credit-card"></em>';
						}else if(menucode == '4000' && i == 0){
							menustr+='<em class="icon-speedometer"></em>';
						}else if(menucode == '5000' && i == 0){
							menustr+='<em class="icon-users"></em>';
						}else{
							
						}
						
						if(i==0){
							menustr += '<span>';
							menustr += n.MENU_NAME;
							menustr += '</span></a>';
							menustr += '<ul id="';
							menustr += menucode;
							menustr += '" class="nav sidebar-subnav collapse in">';
						}else{
							menustr += '<li class="lxm-li-clearboth"><a href="';
							menustr += n.MENU_URL;
							menustr += '" title="'
							menustr += n.MENU_NAME;
							menustr += '" ><span>';
							menustr += n.MENU_NAME;
							menustr += '</span></a></li>';
						}
						
					
					});
					menustr +='</ul></li>';
					$("#leftMenu").append(menustr);
				}
			});
		}
	
	
	
	var current_menu = '${current_menu}';
	loadMenu(current_menu);

		
		
	
});
</script>
<aside class="aside">
    <!-- START Sidebar (left)-->
    <div class="aside-inner">
        <nav data-sidebar-anyclick-close="" class="sidebar">
            <!-- START sidebar nav-->
            <ul id="leftMenu" class="nav">
                <!-- START user info-->
                <li class="has-user-block">
                    <div id="user-block" class="collapse">
                        <div class="item user-block">
                            <!-- User picture-->
                            <div class="user-block-picture">
                                <div class="user-block-status">
                                    <img src="${ctx}/assets/img/user/person.png" alt="Avatar" width="60" height="60"
                                         class="img-thumbnail img-circle">

                                    <div class="circle circle-success circle-lg"></div>
                                </div>
                            </div>
                            <!-- Name and Job-->
                            <div class="user-block-info">
                                <span class="user-block-name">欢迎,小明</span>
                                <%--<span class="user-block-role">软件工程师</span>--%>
                            </div>
                        </div>
                    </div>
                </li>
                <%--<li class="nav-heading ">--%>
                    <%--<span>纳税服务决策系统</span>--%>
                <%--</li>--%>
                <li>
                    <!-- Button used to collapse the left sidebar. Only visible on tablet and desktops-->
                    <a id="show_or_hide" href="#" data-toggle-state="aside-collapsed" class="hidden-xs" title="展开/隐藏">
                        <em class="fa fa-bars"></em>
                        <span>展开/隐藏</span>
                    </a>
                    <!-- Button to show/hide the sidebar on mobile. Visible on mobile only.-->
                    <%--<a href="#" data-toggle-state="aside-toggled" data-no-persist="true" class="visible-xs sidebar-toggle" title="展开菜单">--%>
                    <%--<em class="fa fa-arrow-circle-right"></em>--%>
                    <%--<span>展开菜单</span>--%>
                    <%--</a>--%>
                </li>
                <!-- <li  class="nav-heading ">
                    <span>系统导航</span></em>
                </li> -->
            </ul>
            <!-- END sidebar nav-->
        </nav>
    </div>
    <!-- END Sidebar (left)-->

</aside>

<aside class="offsidebar">
    <nav>
        <div role="tabpanel">
            <div class="tab-content">
                <div class="p">
                    <h4 class="text-muted text-thin">主题选择</h4>
                    <div class="table-grid mb">
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-a.css">
                                    <input type="radio" name="setting-theme" checked="checked">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-info"></span>
                                       <span class="color bg-info-light"></span>
                                    </span>
                                    <span class="color bg-white"></span>
                                </label>
                            </div>
                        </div>
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-b.css">
                                    <input type="radio" name="setting-theme">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-green"></span>
                                       <span class="color bg-green-light"></span>
                                    </span>
                                    <span class="color bg-white"></span>
                                </label>
                            </div>
                        </div>
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-c.css">
                                    <input type="radio" name="setting-theme">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-purple"></span>
                                       <span class="color bg-purple-light"></span>
                                    </span>
                                    <span class="color bg-white"></span>
                                </label>
                            </div>
                        </div>
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-d.css">
                                    <input type="radio" name="setting-theme">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-danger"></span>
                                       <span class="color bg-danger-light"></span>
                                    </span>
                                    <span class="color bg-white"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="table-grid mb">
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-e.css">
                                    <input type="radio" name="setting-theme">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-info-dark"></span>
                                       <span class="color bg-info"></span>
                                    </span>
                                    <span class="color bg-gray-dark"></span>
                                </label>
                            </div>
                        </div>
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-f.css">
                                    <input type="radio" name="setting-theme">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-green-dark"></span>
                                       <span class="color bg-green"></span>
                                    </span>
                                    <span class="color bg-gray-dark"></span>
                                </label>
                            </div>
                        </div>
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-g.css">
                                    <input type="radio" name="setting-theme">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-purple-dark"></span>
                                       <span class="color bg-purple"></span>
                                    </span>
                                    <span class="color bg-gray-dark"></span>
                                </label>
                            </div>
                        </div>
                        <div class="col mb">
                            <div class="setting-color">
                                <label data-load-css="${ctx}/media/css/theme-h.css">
                                    <input type="radio" name="setting-theme">
                                    <span class="icon-check"></span>
                                    <span class="split">
                                       <span class="color bg-danger-dark"></span>
                                       <span class="color bg-danger"></span>
                                    </span>
                                    <span class="color bg-gray-dark"></span>
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </nav>

</aside>
<script type="text/javascript">
//    $(function () {
//        $('#show_or_hide')
//                .on('click', function (e) {
//                    console.log('aaaa');
//                    if($(this).find('em').hasClass('fa-arrow-circle-left')){
//                        $(this).find('em').removeClass('fa-arrow-circle-left').addClass('fa-arrow-circle-right');
//                    }else{
//                        $(this).find('em').removeClass('fa-arrow-circle-right').addClass('fa-arrow-circle-left');
//                    }
//                })
//
//    })
</script>
